<%@ page language="java" contentType="text/html; charset=UTF-8"
	pageEncoding="UTF-8"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<!-- 导入semantic的样式 -->
<jsp:include page="../head.jsp">
	<jsp:param value="客户界面-前台管理界面" name="title" />
</jsp:include>

<script type="text/javascript">
	function chooseclass(target) {
		var classmate = document.getElementById("classmate");
		classmate.innerHTML = "";
		ajax({
			url : "student/assignajax?classid=" + target.value,
			callback : function(xhr) {
				var data;
				// 两种方式
				// JSON.parse(xhr.response);
				if (window.JSON) {
					data = JSON.parse(xhr.response);
				} else {
					data = eval("(" + xhr.response + ")");
				}
				if (data) {
					for (var i = 0; i < data.length; i++) {
						var item = data[i];
						var op = document.createElement("a");
						$(op).addClass("xx");
						$(op).attr("value", item.stuId);
						$(op).css({"font-size":"18px","color":"green","margin-left":"20px"});
						op.innerText = item.stuName;
						classmate.appendChild(op);

					}
				}
			}
		});
	}
	$(function() {
		$("#lookClass").on("click", function() {
			$('.ui.modal').modal('show');
		});

		$(".oooo").on(
				"click",
				".xx",
				function() {
					if (confirm("确认了该生已经毕业了吗？"))
						location.replace("student/makestudentgraduate?id="
								+ $(this).attr("value"))
				});
	});
	// 将客户分配到班级
	$(function() {
		var ids = [];
		$("#assignStudent").on(
				"click",
				function() {
					var a = $("#aaa").attr("value");
					ids = [];
					var checkeds = $(".item-check:checked");
					checkeds.each(function() {
						ids.push(this.value);
					});
					if (ids.length && a && confirm("确认要如此分配吗？")) {
						location.replace("student/assign?deptid=" + a + "&id="
								+ ids.join("&id="))
					}
				});
	});
</script>
</head>
<body>
	<div class="container" class="margin-left-50 margin-top-50">
		<div class="row">
			<div id="content" class="col-lg-12">
				<div class="dao">
					<a class="section" href="manager">学员管理</a> <i
						class="right chevron icon divider"></i> <span
						class="active section">分配班级</span>
				</div>
				<div class="row">
					<div class="col-md-12">
						<!-- BOX -->
						<div class="box border blue">
							<div class="box-title">
								<h4>学员列表</h4>
							</div>
							<div class="dataTables_header clearfix">
								<div style="padding: 10px;">
									<div class="ui selection dropdown">
										<input type="hidden" id="aaa" name="classs"
											value="${param.classs }"> <i class="dropdown icon"></i>
										<div class="default text">选择班级</div>
										<div class="menu">
											<div class="item" data-value="">请选择班级</div>
											<c:forEach items="${classList }" var="cl">
												<div class="item" data-value="${cl.classid }">${cl.classname }</div>
											</c:forEach>
										</div>
									</div>
									<button class="ui inverted brown button" id="assignStudent">分配学员</button>
									<button class="ui inverted green button" id="lookClass">查看班级</button>
									<span name="assignerror">${error }</span>
								</div>
							</div>
							<div class="box-body center">
								<table id="datatable2" cellpadding="0" cellspacing="0"
									border="0"
									class="datatable table table-striped table-bordered table-hover">
									<thead>
										<tr style="text-align: center">
											<th>
												<div>
													<input type="checkbox" id="checkAll"><label></label>
												</div>
											</th>
											<th>姓名</th>
											<th>性别</th>
											<th>学历</th>
											<th>客户来源</th>
											<th>电话</th>
											<th>qq</th>
											<th>家庭住址</th>
										</tr>
									<thead>
									<tbody>
										<c:forEach items="${ customList}" var="custom">
											<tr class="gradeX">
												<td>
													<div>
														<input class="item-check" type="checkbox"
															value="${ custom.customId}"><label></label>
													</div>
												</td>
												<td>${ custom.customName}</td>
												<td>${ custom.customGender}</td>
												<td>${ custom.degreeName}</td>
												<td>${ custom.customSource}</td>
												<td>${ custom.customTel}</td>
												<td>${ custom.customQQ}</td>
												<td>${ custom.customAddress}</td>
											</tr>
										</c:forEach>
										<c:if test="${empty customList}">
											<tr>
												<td style="text-align: center;" colspan="8">暂无记录</td>
											</tr>
										</c:if>
									</tbody>
								</table>
								<c:if test="${totalPage > 1 }">
									<a
										<c:if test="${page!=1}">href="student?page=1${queryString}"</c:if>
										class="${page == 1?'disable':''}">首页</a>
									<a
										<c:if test="${page!=1}">href="student?page=${page-1}${queryString}"</c:if>
										class="${page == 1?'disable':''}">上一页</a>
									<a
										<c:if test="${page!=totalPage}">href="student?page=${page+1 }${queryString}"</c:if>
										class="${page == totalPage?'disable':''}">下一页</a>
									<a
										<c:if test="${page!=totalPage}">href="student?page=${totalPage }${queryString}"</c:if>
										class="${page == totalPage?'disable':''}">最后一页</a>
									<span style="float: right"> ${page}/${ totalPage} </span>
								</c:if>
							</div>
						</div>
					</div>
				</div>
			</div>

			<div class="ui modal"
				style="width: 800px; margin-top: -86px; height: 350px;">
				<i class="close icon"></i>
				<div class="header">选择班级</div>
				<div class=" content"
					style="margin-top: 10px; text-align: left; width: 500px">
					<h4>点击学生即为确定该生毕业</h4>
					<select class="ui selection dropdown" id="allclass"
						onchange="chooseclass(this)">
						<option value="">请选择班级</option>
						<c:forEach items="${classList }" var="cl">
							<option value="${cl.classid }">${cl.classname }</option>
						</c:forEach>
					</select>
					<div class="oooo" id="classmate" style="margin-top: 20px;"></div>
				</div>
			</div>
</body>
</html>